<template>
  <el-form ref="form">
    <el-form-item>
      <div v-for="(item,index) in form" style="float: left;width: 100%;text-align: left">
        <div style="font-size: 16px;text-align: left;margin-left: 80px;width:78%;display: inline">字段名称：</div>
        <el-input v-model="item.fieldName" placeholder="单行输入" style="width:10%;margin-right: 10px;"></el-input>

        <div v-if="item.id>3" style="font-size: 16px;text-align: left;margin-left: 15px;width:78%;display: inline">
          字段内容：
          <div  v-for="(item2,index2) in item.content" style="width: 100%;display: inline">
            <el-input  v-model="item2.content" placeholder="单行输入" style="width:12%;"></el-input>
            <el-button type="primary"  v-if="index2==0" style="" @click="addOne2(index,index2)">✚</el-button>
            <el-button type="danger"   v-else style="margin:0 10px;" @click="delOne2(index,index2)">—</el-button>
          </div>

        </div>
        <el-checkbox label="是否激活" :true-label="1" :false-label="2" v-model="item.display" style="margin-left: 15px;"></el-checkbox>
        <!--        <el-button type="primary"  v-if="item.id==6" style="margin-left:20px;" @click="addOne()">添 加</el-button>-->
        <!--        <el-button type="danger" v-else style="margin-left:20px;" @click="delOne(index)">删 除</el-button>-->

        <div style="width: 100%;height:10px;margin-bottom:20px"></div>
      </div>

    </el-form-item>

    <el-divider></el-divider>

    <el-form-item style="text-align: center">
      <el-button type="primary" @click="onSubmit">提交</el-button>
    </el-form-item>

  </el-form>
</template>

<script>
import { EventBus } 	 from 	"bus/mybus.js";
import {doYlUpdate, getYlData} from "../../crm/system/custom";

export default {
  name: "CustomYl",
  data(){
    return {
      form: {
        list:{
          id:'',
          fieldName:'',
          display:'',
          content:[{content:''}],
        }
      },
    }
  },
  created(){
    this.getRequestData()
  },

  methods:{
    getRequestData(){
      //根据id  获取数据
      const payload       = {}
      payload.operatorId  = this.$store.state.operatorId
      getYlData(payload).then(res=>{
        this.form = res
        console.log("this.form")
        console.log(this.form)
      }).catch(err=>{
        EventBus.$emit('closeloading')
      })
    },

    //新增管理区域..
    addOne(){
      this.form.push({})
    },
    //删除管理区域..
    delOne(index){
      //先去除 employeeId
      this.$delete(this.form,index)
    },

    addOne2(index,index2){
      this.form[index].content.push({})
    },
    //删除管理区域..
    delOne2(index,index2){
      this.form[index].content.splice(index2,1)
    },

    //提交
    onSubmit(){
      this.$confirm('确认提交操作??', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {

        const payload       = this.form
        payload.operatorId  = this.$store.state.operatorId
        doYlUpdate(payload).then(res=>{
          this.$message.success('操作成功')
          //this.$router.go(0);
        }).catch(err=>{
          console.log(res)
          EventBus.$emit('closeloading')
        })

      }).catch(() => {});
    }
  },

}
</script>

<style scoped>
.el-select:hover .el-input__inner {
  border-color: #C0C4CC;
}
</style>